<template>
    <div class='content'>

        <section>
            <div class="profile_page">
                    <head-top  :go-back='goBack'  :head-title="profiletitle"></head-top>
            </div>
            <!--<div class="my_backlog" >-->
              <van-list
                v-model="loading"
                :finished="finished"
                finished-text="没有更多了"
                @load="onLoad"
                :offset="offset"
              >
                      <div  v-for="(item,index) in remainData" :key="item.ID">
                          <div class="newsItem">
                              <div class="itemContent">
                                  <div class="itemLists">
                                      <div class="itemList" v-for="(column,i) in columns" :key="column.field">
                                          <span class="itemName">{{column.header}}</span>
                                          <span class="itemType" v-if="column.header=='序号'">{{index+1}}</span>
                                          <span class="itemType" v-if="column.header!='序号'&&(column.filter.url==''||column.filter== undefined)">{{item[column.field]}}</span>
                                          <span class="itemType" v-if="column.header!='序号'&&column.filter.url!=''">{{item[column.field+'Txt']}}</span>
                                          <!-- <span class="itemType" v-if="column.header!='序号'&&column.filter.url!=''">{{dict(item[column.field],column.filter.url)}}</span> -->
                                      </div>
                                     <!-- <div class="itemList">
                                          <span class="itemName">原因</span>
                                          <span class="itemType">{{item.remark}}</span>
                                      </div>
                                      <div class="itemList">
                                          <span class="itemName">开始时间</span>
                                          <span class="itemType">{{item.applyTime}}</span>
                                      </div>
                                      <div class="itemList">
                                          <span class="itemName">状态</span>
                                          <span class="itemType">{{item.feedbackType=='3675000001'?'未反馈':'已反馈'}}</span>
                                      </div>-->
                                  </div>
                              </div>
                          </div>
                      </div>
              </van-list>
        </section>
    </div>
</template>

<script>
    let that;
    import headTop from '@/components/header/head';
    import {myRemaindDetail,getDict} from '@/service/getData';
    import {setStore,getStore,getDefault} from '@/assets/config/mUtils';
    import { Dialog,Toast } from 'vant';
    export default {
    	data(){
            return{
                profiletitle:'提醒内容查询',
                goBack:true,
                CHECK_TIME: new Date().getTime().toString(),
                app_userId:'',
                remainData:[],
                columns:[],
	            dataArr:[],
                loading: false,
                finished: false,
                pageIndex:0,
                offset: 0,
                codeLists:{},
                flag:0,
            }
        },
        created(){
    		that = this;
    	    this.app_userId = getStore('user_id');
	        this.qryId = this.$route.params.id;
	        var data = {};
// 	        data.app_userId = this.app_userId;
// 	        data.CHECK_TIME = this.CHECK_TIME;
// 	        data.CHECK_SIGN = this.$md5(this.app_userId + this.CHECK_TIME +"3a28fba00c015e0df7f88556c91cb7fc");
	        data.qryId = this.qryId;
	        data.pageIndex = this.pageIndex;
	        data.pageSize = 3;
	        myRemaindDetail(data).then(res=>{
		        this.columns = res.data.columns;
			        var obj = {};
			        this.columns.forEach(function (item) {
				        if(item.editor!= null){
					        if(item.filter.url!=''){
						        var url = item.filter.url.substring(4);
						        var tUrl = item.filter.url;
						        var s = tUrl.substr(tUrl.lastIndexOf("\/")+1);
						        // that.codeLists[s] = JSON.parse(item.editor.data);
//						        var data = getDefault();
//						        getDict(url,data).then(res=>{
//							        var data = res.data;
//
//							        that.codeLists[s] = data;
//							        //that.codeLists.push(obj);
//						        });
					        }
				        }
			        });
			       // this.onLoad();
            });
        },
        mounted(){

        },
        updated(){
//        	if(this.flag <3){
//        		this.flag+=1;
//		        this.onLoad()
//            }
        },
        components:{
            headTop,
        },
        filters:{
	        dictNum: function(val,arg1){
		        if(val!="" && val!=undefined && val!=null){
			        console.log(that.codeLists,"222");
			        var s = arg1.substr(arg1.lastIndexOf("\/")+1);
			        console.log(that.codeLists[s]);
			        if(that.codeLists[s] != undefined){
				        var arr = that.codeLists[s].filter(item=>item.id === val);
				        if(arr.length!=0){
					        return arr[0].text;
				        }
                    }

			        //var arr = [];
                    var text = ''
			        var checkTime = new Date().getTime().toString();
//			        $.ajax({
//                        url:'/api'+ url,
//                        data:data,
//				        dataType:"json",
//				        type:"GET",   //请求方式
//                        async:false,
//                        success:function (res) {
//	                        console.log(res);
//	                    var dataArr = res.data;
//

//                        }
//                    });


		        };
		        //return "1111";
	        }
        },
        methods:{
          onLoad(){
	          var data = {};
	          data.app_userId = this.app_userId;
	          data.CHECK_TIME = this.CHECK_TIME;
	          data.CHECK_SIGN = this.$md5(this.app_userId + this.CHECK_TIME +"3a28fba00c015e0df7f88556c91cb7fc");
	          data.qryId = this.qryId;
	          data.pageIndex = this.pageIndex;
	          data.pageSize = 3;
	          myRemaindDetail(data).then(res=>{
              console.log(res);
              // 加载状态结束
              this.columns = res.data.columns;
              this.loading = false;
              this.offset = 3 * this.pageIndex;
              if(res.data.data.length){
                this.remainData.push(...res.data.data);
              }else {
                this.finished = true;
              }
            });

            this.pageIndex+=1;
          },
            dict(val,url){
	            if(val!="" && val!=undefined && val!=null){
		            console.log(this.codeLists,"222");
		            var s = url.substr(url.lastIndexOf("\/")+1);
		            console.log(this.codeLists[s],s);
		            this.$nextTick(function () {

		            })
		            if(this.codeLists[s]!= undefined){
			            var arr = this.codeLists[s].filter(item=>item.id === val);
			            if(arr.length!=0){
				            return arr[0].text;
			            }
		            }


	            };
            }
        }
    }

</script>

<style lang="scss" scoped>
    @import '../../../assets/style/mixin';
      @import '../../../assets/style/public';
    .newsItem{
      padding-top: 0.5rem;
      .itemDate{
        display: flex;
        justify-content: center;
        font-size:0.6rem;
        color: #cccccc;
        height: 1.6rem;
        line-height:1.6rem;
      }
      .itemContent{
        margin: 0 0.5rem;
        background-color: #fff;
        padding: 0 0.4rem;
        border-top-left-radius: 0.2rem;
        border-top-right-radius: 0.2rem;
        position: relative;
        z-index: 99;
        .itemConHead{
          display: flex;
          align-items: center;
          font-size: 0.6rem;
          color: #333333;
          line-height: 0.8rem;
          padding:0.6rem 0;
          border-bottom: 1px solid #eee;
        }
        .itemLists{
          padding: 0.08rem;
          .itemList{
            display: flex;
            padding: 0.32rem 0;
            align-items: center;
            justify-content: flex-end;
            .itemName{
              color: #999999;
              font-size: 0.56rem;
              flex: 1;
              word-break: keep-all;
            }
            .itemType{
              margin-left: 0.4rem;
              color: #666666;
              font-size:0.56rem;
              width:8rem;
              white-space: normal;
              word-break: break-all;
            }
          }
        }
      }
      .itemNav{
        display: flex;
        justify-content: space-between;
        align-items: center;
        color: #1f9eff;
        font-size:0.6rem;
        height: 1.2rem;
        line-height:1.2rem;
        margin: 0 0.5rem;
        padding: 0.4rem;
        background-color: #fff;
        border-bottom-left-radius: 0.2rem;
        border-bottom-right-radius:0.2rem;
        overflow: hidden;
        .arrow{
          display: flex;
          align-items: center;
          img{
            width: 0.56rem;
            height: 0.56rem;
            vertical-align: top;

          }
        }
      }
    }
</style>
